<!DOCTYPE html>
<html>
<head>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
    <meta charset="UTF-8">
    <title>固件添加</title>
    {% include 'template/baseCss.volt' %}
    <link href="/css/vendor/add-drone.less" rel="stylesheet/less" type="text/css">
    <script src="/js/less.min.js"></script>
</head>
<body>
<main>
    <form>
        <div class="title-bar">
            <label class="server-id">固件添加</label>
        </div>
        <div id="info-wrap">
            <table>
                <tr>
                    <th>固件分类: </th>
                    <td>
                        <select id="firmware_type_id">
                            <option value="">请选择</option>
                            {% for id,name in firmwareTypeList %}
                                <option value="{{ id }}">{{ name }}</option>
                            {% endfor %}
                        </select>
                        <label id="add-type-btn" style="cursor:pointer; font-size: 1.5rem; color: #009bff">添加分类</label>
                    </td>
                </tr>
                <tr>
                    <th>固件名称: </th>
                    <td>
                        <input type="text" id="name"> 尽量控制在40个字符以内
                    </td>
                </tr>
                <tr>
                    <th>版本号: </th>
                    <td>
                        <input type="text" id="version"> 尽量控制在15个字符以内

                    </td>
                </tr>
                <tr>
                    <th>文件上传:</th>
                    <td>
                        <input id="upload-file" type="file">
                    </td>
                </tr>
                <tr>
                    <th>版本说明:</th>
                    <td>
                        {#<div class="version-content" id="content"></div>#}
                    </td>
                </tr>
            </table>
            <div class="version-content" id="content"></div>
        </div>
        <p id="save-btn" class="button" style="visibility: visible">增加</p>
        <p id="reset-btn" class="button" style="visibility: visible">重置</p>
    </form>
    <div class="list-box" style="display: none;">
        <div class="box-title">
            <label>添加分类</label>
            {#<label class="close-btn">close</label>#}
            <img src="/images/info_edit_del.png" class="close-btn" onclick="listBox.closeBoxBtn()">
        </div>
        <div class="box-list">
            <table class="box-table" cellpadding="0" cellspacing="0">

            </table>
        </div>
        <div class="box-bottom-btn">
            <p class="button" onclick="listBox.clickBoxAdd(this)">添加</p>
            <p class="button" onclick="listBox.clickBoxDel()">删除</p>
        </div>
        <div class="input-box" style="display: none;" id="input-box">
            <div class="input-box-title"><label>添加分类</label></div>
            <label>分类名称: </label><input id="input-value"></br>
            <label>分类信息: </label><input id="input-content">
            <div class="input-box-bottom-btn">
                <p class="button" onclick="listBox.clickInputBoxConfirm()">确定</p>
                <p class="button" onclick="listBox.clickInputBoxCancel()">取消</p>
            </div>
        </div>
    </div>
</main>
</body>

{% include 'template/baseJs.volt' %}
<script type="text/javascript" src="/third-part/wang-editor/wangEditor.min.js"></script>
<script src="/js/cos-js-sdk-v5.js"></script>
<script src="/js/vendor/upload-cos.js"></script>

<script>

    var editor = undefined;

    $(function () {
        var E = window.wangEditor;
        editor = new E('#content');
        editor.customConfig.zIndex = 100;
        editor.create();
        CosUpload.cosInit("/file/getCosInfo");
        CosUpload.path = CosUpload.path + "firmware/";
    });

    $("#reset-btn").click(function (){
        location.reload();
    });

    $("#save-btn").click(function () {
        var file = $("#upload-file")[0].files[0];
        var size = file.size;
        if (!file) {
            FAlert("没有上传文件");
            return;
        }
        var type = $("#firmware_type_id").val();
        var name = $("#name").val()
        if (!type) {
            FAlert("请选择固件分类");
            return;
        }
        if (!name) {
            FAlert("请输入固件名称");
            return;
        }
        loadingProgressView.show();
        var date = new Date();
        CosUpload.path = CosUpload.path + "firmware/" + date.getTime().toString() + "/";
        CosUpload.sliceUpload(file, file.name, "firmware", function (res) {
            if (res.status === 0) {
                console.log("上传成功");
                var data = {
                    "action_key": REQUEST_ACTION_ADD,
                    "name": $("#name").val(),
                    "version": $("#version").val(),
                    "firmware_type_id": type,
                    "url": res.url,
                    "html": editor.txt.html(),
                    "size": size
                };
                feimaPost("/firmware/addFirmwareVersion", data, function(result){
                    if (result.status == 0){
                        loadingProgressView.remove();
                        window.location.href = "/firmware/listFirmwareVersion";
                    }else {
                        loadingProgressView.remove();
                        FAlert(result.message);
                    }
                });
            }else {
                loadingProgressView.remove();
                FAlert("上传文件失败: " + res.error);
            }
        }, function (progress) {
            console.log(progress);
            loadingProgressView.setProgress(progress * 0.8 + 0.2);
        }, true);
    });

    $("#add-type-btn").click(function () {
        $(".list-box").css("display", "block");
        listBox.config = {
            "head": {"id": "ID", "name":"分类名称", "content": "分类信息"},
            "colwidth": {"id": "50", "name": "250", "content": "250"},
            "url": "/firmware/listFirmwareType",
            "refresh": "/firmware/addFirmwareVersion"
        };
        listBox.init();
    });
//    $(".close-btn").click(function () {
//        $(".list-box").css("display", "none");
//        window.location.href = "/firmware/addFirmwareVersion";
//    });

</script>
</html>